<template>
	<view>
		<view class="top">
		</view>
		<view class="main">
			<view class="cageList">
				<view class="cage" v-for="cage in adoptionCageList" :key="cage.cageId" @click="goPigeonDetail(cage)">
					<view class="info">
						<view class="shed">{{cage.cagePosition}}</view>
						<view class="layEggCount">当前下蛋：{{cage.layEggCount}}</view>
					</view>
					<image class="img"
						src="https://gulimall-void.oss-cn-guangzhou.aliyuncs.com/icon/cage%28four%29.png">
					</image>
					<view class="time">{{cage.time}}</view>
					<view class="tag" v-if="cage.isNew">新增</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import PutForm from '../../components/Shop/PutForm.vue'
	export default {
		components: {
			PutForm
		},
		data() {
			return {
				//tree2在右边的个数
				count: 2,
				ids: [],
				goodsList: [],
				putFormShow: false,
				adoptionCageList: []
			}
		},
		onShow() {
			this.getAdopitonCageList()
		},
		methods: {
			//修改鸽笼新增状态
			async updateIsNew(cageId) {
				const res = await this.$myRequest({
					url: 'user/adoptionCage/update',
					method: 'put',
					data: {
						'cageId': cageId,
						'isNew': 0
					}
				})
			},
			// 打开上架弹窗
			put(id) {
				this.ids[0] = id;
				this.getGoodsList();
				this.putFormShow = true;
			},
			// 获取商品列表
			async getGoodsList() {
				const res = await this.$myRequest({
					url: 'pigeon/applet/getGoodsList/' + 1,
					method: 'post',
					data: this.ids
				})
				if (res && res.code === 0) {
					this.goodsList = res.data
				}
			},
			// 获取鸽笼列表
			async getAdopitonCageList() {
				uni.showLoading()
				const res = await this.$myRequest({
					url: 'user/adoptionCage/getUserCageList'
				})
				if (res && res.code === 0) {
					this.adoptionCageList = res.data || []
					if (this.adoptionCageList.length > 0) {
						this.isActivity2FinishedToday();
						//计算count
						const size = this.adoptionCageList.length;
						this.count = Math.max((size + 2) / 6, 2);
					}

				} else {
					uni.showToast({
						title: res.msg,
						icon: 'none'
					})
				}
				uni.hideLoading()
			},
			//去种鸽详情页
			goPigeonDetail(cage, index) {
				uni.navigateTo({
					url: '../cageDetail/cageDetail?cage=' + encodeURIComponent(JSON.stringify(cage))
				})
				console.log(cage)
				console.log(cage.cageId, cage.isNew)
				if (cage.isNew == 1) {
					//修改鸽笼新增状态
					this.updateIsNew(cage.cageId)
				}
			},
			//判断是否今天已加过积分
			async isActivity2FinishedToday() {
				const res = await this.$myRequest({
					url: 'user/pointsRecord/isActivity2FinishedToday'
				})
				if (!res.data) {
					this.updatePoints(2, this.adoptionCageList.length);
				}
			},
			//根据鸽笼数量加积分
			async updatePoints(activityId, count) {
				const res = await this.$myRequest({
					url: 'user/pointsRecord/save',
					method: 'post',
					data: {
						activityId,
						count
					}
				})
				if (res && res.code === 0) {
					uni.showToast({
						title: res.msg,
						icon: 'none'
					})
				}
			},
		}
	}
</script>

<style lang="scss">
	@import '@/static/iconfont/iconfont.css';

	page {
		background: url('https://gulimall-void.oss-cn-guangzhou.aliyuncs.com/icon/bg.png') no-repeat;
		background-size: 100% 100%;
		background-attachment: fixed;
	}

	.top {
		margin-top: 10rpx;
		margin-left: 40rpx;
		display: flex;
		height: 150rpx;
	}


	.tree1,
	.tree2 {
		width: 180rpx;
		height: 160rpx;
	}


	.main {
		margin: 0 20rpx 0 20rpx;
		display: flex;

		.cageList {
			width: 710rpx;
			// background-color: #a86642;
			// background-color: #C99766;
			// background-color: #8F939D;
			border-radius: 10px;

			.cage {
				position: relative;
				float: left;
				height: 270rpx;
				margin: 0 5rpx 0 5rpx;
				width: 220rpx;

				// width: 200rpx;
				.info {
					top: -60rpx;
					left: 15rpx;
					position: absolute;
					font-size: 26rpx;
					background-color: white;
					border-radius: 10px;
					padding: 10rpx;
				}

				.img {
					display: block;
					margin-left: 13rpx;
					width: 200rpx;
					height: 200rpx;
					float: left;
				}

				.tag {
					right: -5rpx;
					bottom: 75rpx;
					position: absolute;
					background-color: #FFB300;
					text-align: center;
					border-radius: 10px;
					line-height: 50rpx;
					width: 80rpx;
					height: 50rpx;
					font-size: 25rpx;
					color: white;
				}
			}
		}

		// .treeList{
		// 	width: 180rpx;
		// }
	}

	// .footer{
	// 	margin-left: 30rpx;
	// }

	// .cageList {
	// 	width: 700rpx;
	// 	margin: 10rpx 25rpx 0 25rpx;
	// 	background-color: #FFB300;
	// 	color:#8B4513;

	// 	.cage {
	// 		background-color: #FFF8DC;
	// 		margin: 10rpx;
	// 		width: 660rpx;
	// 		border-radius: 10px;
	// 		font-size: 35rpx;
	// 		padding: 10rpx;

	// 		.cagePosition {
	// 			color: #5a3202;
	// 			font-size: 40rpx;
	// 			font-weight: 500;
	// 			width: 580rpx;
	// 			margin-bottom: 5rpx;
	// 		}

	// 		.tag {
	// 			color: #FFB300;
	// 		}
	// 	}
	// }

	// .cage {
	// 	border-radius: 10px;
	// 	margin: 10rpx;
	// 	width: 700rpx;
	// 	height: 230rpx;
	// 	background-color: #ffffff;
	// 	display: flex;

	// 	.message {
	// 		text-align: center;
	// 		margin: 5rpx;
	// 		width: 600rpx;
	// 		font-size: 25rpx;
	// 		color: #444;
	// 	}

	// 	.putButton {
	// 		image {
	// 			margin-right: 20rpx;
	// 			width: 50rpx;
	// 			height: 45rpx;
	// 		}

	// 		view {
	// 			color: #888;
	// 			margin-left: 10rpx;
	// 			font-size: 20rpx;
	// 		}
	// 	}
	// }
</style>
